<template>
    <div class="blogUpdate">
      <ul>
        <li>
          <span>标题：</span>
          <input type="text" v-model="Item.title" class="title_input">
        </li>
        <li>
          <span>内容：</span>
          <wangeditor :content="Item.content" @getcontent="getcontent"></wangeditor>
        </li>
      </ul>
      <div class="but">
        <el-button type="success"  @click="back">放回上一页</el-button>
        <el-button type="warning" @click="update">确认修改</el-button>        
      </div>

    </div>
</template>

<script>
import wangeditor from '../wangEnduit/wangEnduit.vue'
export default {
    data () {
      return {
        Item:"",
        user:"",
        setBlogUrl:this.pathUrl.setBlogUrl,
        // setBlogUrl:"http://localhost:3003/api/blog/update"
      }
    },

    methods: {
      /**
         * 正确提醒
         */
      open2(message) {
                this.$message({
                showClose: true,
                message,
                type: 'success',
                duration:1500,
                });
      },
      /**
       * 返回上一页
       */
      back(){
        window.history.go(-1); 
      },
      /**
       * 获取内容
       */
      getItem(){
        this.Item=JSON.parse(localStorage.getItem("item")) 
        // console.log(this.Item.content)
      },
      /**
       * 获取用户信息
       */
      getUser(){
        this.user=JSON.parse(localStorage.getItem("user")) 
      },
      /**
       * 内容传值
       */
      getcontent(val){
        this.Item.content=val
        console.log(this.Item.content)
      },
      /**
       * 修改博客内容
       */
      update(){
        this.$axios.post(this.setBlogUrl,{
          title:this.Item.title,
          content:this.Item.content,
          id:this.Item.id
        })
        .then((result) => {
          if(result.data.status=="ok"){
            this.open2(result.data.msg)
            this.$router.push({path:'/blog/blogLook',query:{id:this.Item.id}})
          }
        })
        .catch((err) => {
          
        });
      },
    },
    mounted:function(){
        this.getUser()
        this.getItem()
    },
    components: {wangeditor},
}
</script>

<style scoped>
.blogUpdate{
  padding: 0 10%;
}
.blogUpdate>li{
  text-align: left;
}
.but{
  width: 100%;
  display:flex;
  justify-content: center;
  align-items: center;
  margin:10px auto
}
.title_input{
  width: 80%;
}
</style>